<div id="tableWrapperID">
  <div id="tableWrapperHeaderID">
    <span>
      <%=t('list.weights')%>
    </span>
  </div>
  <div id="tableWrapperBodyID">
    <span class="tooltip">
        <span><%=t('tooltip.record.add')%></span>
        <%= link_to t('add.item'), new_weight_path, :class => "link link-inline" %>
    </span>
    <div class="eating-color-description">
      <span>
        <%=t('field.eating.overweight')%>
      </span>
      <div class="eating-color-overweight">&nbsp;</div>
      <span>
        <%=t('field.eating.violation')%>
      </span>
      <div class="eating-color-violation">&nbsp;</div>
      <span>
        <%=t('field.eating.normal')%>
      </span><div class="eating-color-normal">&nbsp;</div>
    </div>
    <div class="paginator">
      <%= paginate @weights%>
    </div>
    <table id="dataTableID">
      <thead>
          <tr>
            <th id="editButtonsHeaderID">
              &nbsp;
            </th>
            <th id="weightDateHeaderID">
              <%=t('field.common.date')%>
            </th>
            <th id="weightWeightHeaderID">
              <%=t('field.weight.weight')%>
            </th>
            <th id="weightDayDifferenceHeaderID">
              &Delta; <%=t('field.weight.day_difference')%>
            </th>
            <th id="weightWeekDifferenceHeaderID">
              &Delta; <%=t('field.weight.week_difference')%>
            </th>
            <th id="weightMonthDifferenceHeaderID">
              &Delta; <%=t('field.weight.month_difference')%>
            </th>
            <th></th>
            <th></th>
          </tr>
      </thead>
    </table>
    <div id="dataWrapperID">
      <%=render 'weights/weights'%>
    </div>
  </div>
</div>

<script type="text/javascript">
    jQuery(document).ready(function(){
        resizeDataWrapper();
        jQuery(window).resize(function(){resizeDataWrapper();});
    });
</script>

